﻿@model MusicOnLine.Models.Album

@{
    ViewBag.Title = "Edit";
    Layout = "~/Views/Shared/_Layoutback.cshtml";
}


<style type="text/css">
     input{ vertical-align:middle; margin:0; padding:0}
    .file-box{ position:relative;width:340px; margin-top:5px;}
    .txt{ height:18px; border:1px solid #ABADB3; width:180px;}
    .btn{ background-color:#FFF; border:1px solid #ABADB3;height:20px; width:70px;}
    .file{ position:absolute; top:0; right:80px; height:24px; filter:alpha(opacity:0);opacity: 0;width:260px }
</style>


@using (Html.BeginForm("Edit", "ManageAlbum", FormMethod.Post, new { enctype = "multipart/form-data", id = "fileImgUrl" }))
{
    @Html.ValidationSummary(true)
    <fieldset>
        <legend>Album</legend>

        @Html.HiddenFor(model => model.ID)

        <div class="editor-label">
            @Html.LabelFor(model => model.ArtistID)
        </div>
        <div class="editor-field">
            @Html.DropDownList("ArtistID",ViewBag.ArtistList as SelectList)
            @*@Html.EditorFor(model => model.ArtistID)*@
            @Html.ValidationMessageFor(model => model.ArtistID)
        </div>

      @*  <div class="editor-label">
            @Html.LabelFor(model => model.AlbumName)
        </div>*@
        <div class="editor-field">
            @Html.EditorFor(model => model.AlbumName)
            @Html.ValidationMessageFor(model => model.AlbumName)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.ArtistName)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.ArtistName)
            @Html.ValidationMessageFor(model => model.ArtistName)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.PublishYear)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.PublishYear)
            @Html.ValidationMessageFor(model => model.PublishYear)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.PublishCompany)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.PublishCompany)
            @Html.ValidationMessageFor(model => model.PublishCompany)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.SongsCount)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.SongsCount)
            @Html.ValidationMessageFor(model => model.SongsCount)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.SongsLength)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.SongsLength)
            @Html.ValidationMessageFor(model => model.SongsLength)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.ImgUrl)
        </div>
        <div class="editor-field">
            <div>
                    <div style="width:200px; height:200px; border-radius:10px; line-height:200px; border:solid 1px gray; overflow:hidden; text-align:center;">
                        <img style="max-height:200px; max-width:200px; vertical-align:middle;" src="@Url.Content("~/AlbumImg/"+Model.ImgUrl)" />
                    </div>
                </div>
             <div class="file-box">
              @Html.TextBoxFor(model=>model.ImgUrl)
            @* <input type='text' name='ImgUrl' id='ImgUrl' value="@Model.ImgUrl" class='txt' />  *@
             <input type='button' class='btn' value='浏览...' />
             <input type="file" name="fileImgUrl" class="file" id="fileImgUrl" size="28" onchange="document.getElementById('ImgUrl').value=this.value" />
             @Html.ValidationMessageFor(model => model.ImgUrl)
            </div>          
        </div>
        @Html.HiddenFor(o=>o.CreateBy)
        @Html.HiddenFor(o=>o.CreateDate)
        @Html.HiddenFor(o=>o.ModifyBy)
        <p>
            <input type="submit" value="Save" />
        </p>
    </fieldset>
}

<div>
    @Html.ActionLink("Back to List", "Index")
</div>
<script type="text/javascript">
    $(document).ready(function () {
        $("#divMangeAlbum").addClass("currentMenu");
    })
</script>